<template>
  <div>
    <a-row class="mb10">
      <a-col :span="12">
        <div class="pos-rlt t10">组织架构/某某组织</div>
      </a-col>
      <a-col :span="12" class="flx-e">
        <ZgInput :width="200" class="mr10"></ZgInput>
        <ZgButton icon="search">查询</ZgButton>
      </a-col>
    </a-row>
    <a-table
      size="small"
      bordered
      :customHeaderRow="customHeaderRow"
      :pagination="false"
      :row-selection="{ selectedRowKeys: ids, onChange: onSelectChange }"
      :data-source="list"
      :scroll="{ x: scrollX, y: winHeight-extraHeight }">
      <slot name="columns"></slot>
      <a-table-column fixed="right" :width="60" title="操作">
        <template slot-scope="text,record">
          <a-dropdown>
            <a class="ant-dropdown-link" @click="e => e.preventDefault()">
              <i class="fa fa-ellipsis-h"/>
            </a>
            <a-menu slot="overlay">
              <a-menu-item @click="toDel(record.id)"><i class="fa fa-trash mr5"/>删除</a-menu-item>
              <a-menu-item @click="toUpdate(record)"><i class="fa fa-pencil mr5"/>修改</a-menu-item>
            </a-menu>
          </a-dropdown>
        </template>
      </a-table-column>
    </a-table>
    <div class="flx-e mt10">
      <a-pagination
        showSizeChanger
        showQuickJumper
        v-model="page"
        :total="total"
        :pageSize="pageSize"
        :pageSizeOptions="pageSizeOptions"
        @change="onPageChange"
        @showSizeChange="onPageChange"
        :showTotal="total => `总共 ${total} 条记录`"
      />
    </div>
  </div>
</template>

<script>
import { pageMixin } from '@/core/page-mixin'
export default {
  mixins: [pageMixin],
  props: {
    orgId: {
      type: String,
      default: ''
    }
  },
  data () {
    return {
      scrollX: 1500,
      extraHeight: 400,
      pageSizeOptions: ['10', '20', '30', '40', '50', '100']
    }
  },
  mounted () {
    this.search()
  },
  watch: {
    orgId () {
      this.search()
    }
  },
  methods: {
    customHeaderRow () {
      return {
        style: {
          background: '#f2f2f2'
        }
      }
    },
    onSelectChange (selectedRowKeys) {
      this.ids = selectedRowKeys
    },
    search () {

    }
  }
}
</script>
<style lang="less" scoped>
</style>
